<template>
  <div class="root"> 
    <!-- <MyHeader bgColor="green" fontColor="red" title="购物车案例"></MyHeader> -->
    <MyHeader bgColor="#1d7bff" title="购物车案例"></MyHeader>
    <MyGoods v-for="item in goodsList" :key="item.id" 
    :obj="item"></MyGoods>
    <MyFooter :arr="goodsList"></MyFooter>
  </div>
</template>

<script>
import MyHeader from "@/components/MyHeader.vue"
import MyGoods from "@/components/MyGoods.vue"
import MyFooter from "@/components/MyFooter.vue"
import { getList } from "@/api/cart.js"
export default {
  components: { MyHeader,MyGoods,MyFooter },
  data(){
    return {
      goodsList: []
    }
  },
  created(){
    // 获取购物车列表数据
    getList().then(res=>{
      // console.log(20,res);
      this.goodsList = res.data.list;
    })
  }
}
</script>

<style lang="less" scoped>
.root{
  padding-top: 45px;
}
</style>